/******************************************************************************************
 * Import
 ******************************************************************************************/

// module
import Taro, { Component } from '@tarojs/taro'
import { AtInput, AtForm  }  from 'taro-ui';
import { Input } from '@tarojs/components'

// project
import { CPage, CContent, CHeader, CFooter, CFloat, CAround, CBetween, CCenter, CRow, CColumn, CWrap, CLine, CHand, CItemX, CItemY, CText, CLabel, CSvg, CImage, CButton } from '../../../library/comp';
import { Base64, Gen, Time, Zip, Session, Storage, Http, Toast } from '../../../library/func';
import Icon from '../../../project/style/icon';
import DoHttp from '../../../project/func/http/http';

/******************************************************************************************
 * Export Class
 ******************************************************************************************/

export default class Presenter extends Component {

	/*------------------------------------------------------------------------------------
	 * 初始化
	 *-----------------------------------------------------------------------------------*/
	constructor(props) {
		super(props);

		/**
		 * state
		 */
		this.state = {
			set_dist_number:false,
            detailBool:false,
			atinput:'',
			data:'',
		}
	}

	/*------------------------------------------------------------------------------------
	 * 生命周期
	 *-----------------------------------------------------------------------------------*/
	// didMount
	componentDidMount() {
		
	}

	/*------------------------------------------------------------------------------------
	 * 事件处理
	 *-----------------------------------------------------------------------------------*/
    // onRedirect 跳转至详情页
    onRedirect = (url, e)=> {
        wx.redirectTo({
            url: url
        })
    }
	
	/*------------------------------------------------------------------------------------
	 * 自定义方法
	 *-----------------------------------------------------------------------------------*/

	config = {
        navigationBarTitleText: '邀请码',
        navigationBarBackgroundColor: '#dd2f3c',
        navigationBarTextStyle: '#fff'
    }

	// 邀请码绑定
	handleChange = (value) =>{
		this.setState({
			atinput:value.detail.value
		})
	}
	// 点击下一步
	toNext = () => {
		DoHttp.post({
			url:'vip/logic/bindDist.php',
			data:{
				dist_number: this.state.atinput
			},
			success: (data) => {
				this.setState({
					data:data
				},()=>{
					if(this.state.data.msg == ''){
						this.onRedirect.bind(this,'/screen/user/setting/success')
					}else{
						Toast.text(this.state.data.msg)
					}
				})
			},
			error:(data) => {
				this.setState({
					data:data
				},()=>{
					if(this.state.data.msg == ''){
						this.onRedirect.bind(this,'/screen/user/setting/success')
					}else{
						Toast.text(this.state.data.msg)
					}
				})
			}
		})

		
	}
	//  详细规则 隐藏/显示
    detailChange = () => {
		this.setState({
			detailBool:!this.state.detailBool,
		})
    }

	/*------------------------------------------------------------------------------------
	 * 渲染
	 *-----------------------------------------------------------------------------------*/
	render () {
		return (
			<CPage>
				<CContent>
					{/*背景图*/}
                    {/*<CImage></CImage>*/}

					{/* 表单 */}
					<CColumn mt='70' px='30' mb='120' >
						<CRow bb='1px solid #cbcbcb' mb='56' >
							<Input 							
								type='text' 
								style='width:100%;font-size:30rpx;padding-bottom:10rpx;'
								placeholder='请输入邀请码' 
								placeholderStyle='font-size:30rpx;'							
								value={this.state.atinput} 
								
								onInput={this.handleChange.bind(this)} 
							/>
						</CRow>
						{/* 按钮可以点击的样式需要产品确定 */}
						{
							this.state.atinput  ? (
								<CButton
									bg='#f1d193'
									color='#fff'
									class='w1' h='80' lh='80' ra='10'
									onClick={this.toNext}
								>下一步</CButton>
							) : (
								<CButton
									bg='#e7e7e7'
									color='#9f9f9f'
									class='w1' h='80' lh='80' ra='10'
								>下一步</CButton>
							)
						}
						
					</CColumn>

                    {/* 规则 */}
					{
						this.state.detailBool ? (
							<CColumn>
								<CRow x='center' mb='24' >
									<CHand onClick={this.detailChange} y='center' >
										<CText size='28' color='#6f6f6f' mr='3' >邀请码详细规则</CText>
										<CSvg w='40' h='40' icon={Icon.upper} />
									</CHand>
								</CRow>
								<CColumn px='30' >
									<CRow><CText size='28' color='#6f6f6f' mb='24'>1. 邀请码为每日一达VIP用户专属码，请和您的推荐人确认邀请码</CText></CRow>
									<CRow><CText size='28' color='#6f6f6f' mb='24'>2. VIP用户可以登录APP，在邀请模块查看</CText></CRow>
									<CRow><CText size='28' color='#6f6f6f' mb='24'>3. 一个用户只可以绑定一个邀请码</CText></CRow>
								</CColumn>
							</CColumn>
						) : (
							<CRow x='center' mb='24' >
								<CHand onClick={this.detailChange} y='center' >
									<CText size='28' color='#6f6f6f' mr='3' >邀请码详细规则</CText>
									<CSvg w='30' h='30' icon={Icon.down} color='#5d5d5d' />
								</CHand>
							</CRow>
						)
					}
				</CContent>
			</CPage>
		)
	}
}


